"use client";
import { Edit, useForm } from "@refinedev/antd";
import { useParsed } from "@refinedev/core";
import { Form, Input, Select, Alert } from "antd";
import MenuSelector from "@/components/menu-selector";

export default function RoleEdit() {
  const { id } = useParsed();
  const { formProps, saveButtonProps, queryResult } = useForm({
    resource: "system/role",
    id: id
  });
  const isProtected = Number(id) === 1;

  return (
    <Edit saveButtonProps={isProtected ? { ...saveButtonProps, disabled: true } : saveButtonProps}>
      {isProtected && (
        <Alert
          message="超级管理员角色保护"
          description="ID为1的超级管理员角色不可修改，这是系统保护机制。"
          type="warning"
          showIcon
          style={{ marginBottom: 16 }}
        />
      )}
      <Form {...formProps} layout="vertical">
        <Form.Item name={["role_name"]} label="角色名称" rules={[{ required: true }]}>
          <Input placeholder="请输入角色名称" disabled={isProtected} />
        </Form.Item>
        <Form.Item name={["role_key"]} label="权限字符串" rules={[{ required: true }]}>
          <Input placeholder="请输入权限字符串" disabled={isProtected} />
        </Form.Item>
        <Form.Item name={["role_sort"]} label="显示顺序" rules={[{ required: true }]}>
          <Input type="number" placeholder="请输入显示顺序" disabled={isProtected} />
        </Form.Item>
        <Form.Item name={["status"]} label="状态" rules={[{ required: true }]}>
          <Select placeholder="请选择状态" disabled={isProtected}>
            <Select.Option value="0">正常</Select.Option>
            <Select.Option value="1">停用</Select.Option>
          </Select>
        </Form.Item>
        <Form.Item name={["menu_ids"]} label="菜单权限">
          <MenuSelector disabled={isProtected} />
        </Form.Item>
        <Form.Item name={["remark"]} label="备注">
          <Input.TextArea rows={2} placeholder="请输入备注信息" disabled={isProtected} />
        </Form.Item>
      </Form>
    </Edit>
  );
} 